{#
Copyright (c) 2020 Andy Zhou
MIT License
#}
{% from 'bootstrap/nav.html' import render_nav_item %}
{% from 'macros.html' import static_file, change_theme %}
<!DOCTYPE html>
<html>
<head>
    {% block head %}
        <title>{% block title %}Flog{% endblock title %}</title>
        {% block metas %}
            <meta charset="utf-8">
            <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        {% endblock metas %}
        {% block styles %}
            {{ static_file('icon', 'favicon/favicon.svg')}}
            {{ static_file('css', 'css/%s.min.css' % request.cookies.get('theme', 'default')) }}
            {{ static_file('css', '//cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css', local=False) }}
            {{ static_file('css', '//cdn.jsdelivr.net/npm/toastr@2.1.4/build/toastr.min.css', local=False) }}
        {% endblock styles %}
    {% endblock head %}
</head>
<body>
{% block navbar %}
    <nav class="navbar navbar-expand-lg navbar-dark bg-primary">
        <a class="navbar-brand" href="/">Flog</a>
        <button class="navbar-toggler collapsed" type="button" data-toggle="collapse"
                data-target="#collapse" aria-controls="collapse" aria-expanded="false"
                aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="collapse">
            <ul class="navbar-nav mr-auto">
                {{ render_nav_item('main.main', _('Main')) }}
                {{ render_nav_item('feedback.feedback', _('Feedback')) }}
                {{ render_nav_item('others.about_us', _('About Us')) }}
            </ul>
            <ul class="nav navbar-nav navbar-right">
                {% if current_user.is_authenticated %}
                    <li class="nav-item">
                        <a href="{{ url_for('user.user_profile', username=current_user.username) }}" class="nav-link">
                            {# Display user identicon as a circle here #}
                            <img src="{{ current_user.gravatar(size=30) }}" alt="identicon" class="rounded-circle">
                        </a>
                    </li>
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" data-toggle="dropdown" id="account">
                            {{ _('Account') }}
                        </a>
                        <div class="dropdown-menu">
                            <a href="{{ url_for('user.edit_profile') }}" class="dropdown-item" id="edit-profile">{{ _('Edit Profile') }}</a>
                            <a href="{{ url_for('auth.logout') }}" class="dropdown-item" id="logout">{{ _('Log out') }}</a>
                            {% if not current_user.confirmed %}
                                <a href="{{ url_for('auth.resend_confirmation') }}" class="dropdown-item" id="resend-confirmation">
                                    {{ _('Resend Confirmation Email') }}
                                </a>
                            {% endif %}
                            <a href="{{ url_for('auth.delete_account') }}" class="dropdown-item text-white bg-danger">
                                {{ _('Delete Your Account') }}
                            </a>
                        </div>
                    </li>
                    <li class="nav-item">
                        <a href="{{ url_for('notification.show', filter='unread') }}" class="nav-link">
                            <span class="fa fa-bell"></span>
                            <span id="notification-badge" class="badge badge-notification badge-danger" data-href="{{ url_for('ajax.notification_count') }}"
                            style="{% if notification_count == 0 %}display: none{% endif %}">
                                {{ notification_count }}
                            </span>
                        </a>
                    </li>
                {% else %}
                    <li class="nav-item">
                        <a href="{{ url_for('auth.login') }}" class="nav-link">{{ _('Log in / Register') }}</a>
                    </li>
                {% endif %}
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" href="#" id="navbardrop" data-toggle="dropdown">
                        {{ _('Theme') }}
                    </a>
                    <div class="dropdown-menu">
                        {% for theme_name, display_name in config.BOOTSTRAP_THEMES.items() %}
                            <a class="dropdown-item"
                                href="{{ url_for('others.change_theme', theme_name=theme_name, next=request.full_path) }}">
                                {{ display_name }}
                            </a>
                        {% endfor %}
                    </div>
                </li>
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" href="#" data-toggle="dropdown">
                        <span class="fa fa-language"></span>
                        {{ _('Language') }}
                    </a>
                    <div class="dropdown-menu">
                        {% for language, display_name in config.LOCALES.items() %}
                            <a class="dropdown-item"
                               href="{{ url_for('language.set_locale', locale=language) }}">
                               {{ display_name }}
                            </a>
                        {% endfor %}
                    </div>
                </li>
            </ul>
        </div>
    </nav>
{% endblock navbar %}
{% block flashed_messages %}
    {% for message in get_flashed_messages(with_categories=True) %}
        {% if message[0] != 'message' and message[0] %}
            {% set category = message[0] %}
        {% else %}
            {% set category = 'info' %}
        {% endif %}
        {% set message_content = message[1] %}
        <div class="alert alert-{{ category }}" class="close">
            <button type="button" class="close" data-dismiss="alert">&times;
            </button>
            {{ message_content }}
        </div>
    {% endfor %}
{% endblock flashed_messages %}
{% block content %}
    <div id="toast"></div>
    <div class="container">
        {% block page_content %}{% endblock %}
    </div>
{% endblock %}
<footer class="footer" style="margin-left: 10px; width: 100%; padding: 20px; margin-top: 100px">
    &copy; Copyright 2020 Andy Zhou
</footer>
{% block scripts %}
    {{ static_file('js', '//cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.min.js', local=False)}}
    {{ static_file('js', '//cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js', local=False) }}
    {{ static_file('js', '//cdn.jsdelivr.net/npm/toastr@2.1.4/toastr.min.js', local=False) }}
    {{ moment.include_moment(local_js="https://cdn.staticfile.org/moment.js/2.9.0/moment-with-locales.min.js") }}
    {{ moment.locale(auto_detect=True) }}
    {{ static_file('js', 'js/script.js') }}
    {% if current_app.config['FLASK_CONFIG'] == 'production' %}
        <script>
            $(document).ready(function (){
            if (window.navigator._selenium || window.navigator.webdriver){
                document.getElementsByTagName('body')[0].innerHTML = 'F**k You spider';
            }})
        </script>
    {% endif %}
    <script>
        {% if current_user.is_authenticated %}
            var is_authenticated = true;
        {% else %}
            var is_authenticated = false;
        {% endif %}
        if(is_authenticated) {
            setInterval(update_notifications_count, 30000);
        }
    </script>
{% endblock scripts %}
</body>
</html>
